<%@ page language="java" contentType="text/html;charset=UTF-8"	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="${ctx}/css/b.css">
<link rel="stylesheet" type="text/css" href="${ctx }/css/css.css">
<link rel="stylesheet" type="text/css" href="${ctx }/css/main.css">
<link rel="stylesheet" type="text/css" href="${ctx }/css/mybutton.css">
<title>长江师范学院失物招领中心-用户注册</title>
<script src="${ctx}/assets/js/jquery.min.js" ></script>
<script src="${ctx }/js/ajaxupload.js"></script>
<style type="text/css">
	body{
		font-family: '微软雅黑';
	}
	.head_div{
		text-align: right;
		font-size: 12px;
		padding-right: 20px;
		background-color: currentColor;
	}
	.head_msg{
		color: white;
	}

</style>  
</head>


<body style="padding: 0px;" class="response-wider">

<!--导航菜单-->
	<div class="MainMenu" style="margin-bottom: 8px;">
		<div class="MenuList" style="min-width: 500px; background: transparent none repeat scroll 0% 0%;">
			<dl>
				<dt>
					<a href="${ctx }/swzl/index"><div>首页</div></a>
				</dt>
			</dl>
			<dl class="ch">
				<dt>
					<c:if test="${not empty swzlUser}">
						<a href="${ctx }/swzl/userInfo?type=myInfo"><div>${swzlUser.name }</div></a>
					</c:if>
					<c:if test="${empty swzlUser}">
						<a href="${ctx }/swzl/userInfo?type=goLogin"><div>登录/注册</div></a>
					</c:if>
				</dt>
			</dl>
			<dl>
				<dt>
					<a href="${ctx }/swzl/index?typeParentId=1"><div>失物招领</div></a>
				</dt>
			</dl>
			<dl>
				<dt>
					<a href="${ctx }/swzl/index?typeParentId=2"><div>寻物启事</div></a>
				</dt>
			</dl>
			<dl>
				<dt>
					<a href="${ctx }/swzl/index?typeParentId=3"><div>我发布的</div></a>
				</dt>
			</dl>
			<c:if test="${not empty swzlUser}">
				<dl>
					<dt>
						<a href="${ctx }/swzl/userInfo?type=loginOut"><div>退出</div></a>
					</dt>
				</dl>
			</c:if>						
		</div>
	</div>
<!-- 导航菜单 -->

 <div class="content-rightk" style="margin: 0px auto; width: 1080px; background: transparent none repeat scroll 0% 0%; float: none;"> 

	<div class="content-right z_content" style="margin: 0px auto; width: 1070px; background: transparent none repeat scroll 0% 0%; float: none;">
	
	<h5 style="background: rgb(221, 221, 221) none repeat scroll 0% 0%;">新用户注册</h5>
	<form action="${ctx }/swzl/userInfo?type=register" method="post">
		<!-- start:表单开始 -->
		<div class="z_from">
		  <!-- start:必填信息 -->
			<h4 style="border-top: 1px solid rgb(228, 55, 22);">基本信息</h4>
			<div style="color: red;">以下注册信息,只有我们网站官方和你本人可以查看,请放心填写,我们只在必要时才会联系你,并且我们会严密保护您的隐私,*表示必填项</div>
			<br>
			<div class="form-horizontal">
			  
			 <div class="control-group">
			    <label class="control-label"><img src="${ctx}/images/redx.png" >头像：</label>
				<div class="controls">
					 <div style="width: 100px;height: 100px;border: 1px solid #ccc" >
						<img src="${ctx }/upload/image.png" style="width: 100px;height: 100px;" id="head_img"/>
						<input type="hidden" id="headImg" name="headImg" />
					</div>
					<button style="margin-top: 8px; width: 100px; display: block;" class="button button-glow button-rounded button-raised button-primary" id="addLabProdPic">上传头像</button>
			   </div>
			</div>
			            
			<div class="control-group">
				<label class="control-label"><img src="${ctx}/images/redx.png">用户名：</label>
				<div class="controls">
					<input id="user_name" name="user_name" size="20" maxlength="14" value="" placeholder="请填写您的用户名" type="text">
					<span class="notic_info">
					  	不超过7个汉字，或14个字节(数字，字母和下划线)
					</span>
			  </div>
			</div>
			
			<div class="control-group">
				<label class="control-label"><img src="${ctx}/images/redx.png">密码：</label>
				<div class="controls">
					<input name="pass_word" id="pass_word" value="" maxlength="14" placeholder="请设置您的密码" type="password">
					<div id="pwd_error" class="item_error" style="margin-top: 1px; color: rgb(255, 0, 0); height: 14px; display: none;"></div>
					<span class="notic_info">
						密码长度6～14位，字母区分<span id="showhintspan"></span>大小写。
					</span>
				</div>
			</div>
			              
			<div class="control-group" style="display: block;">
				<label class="control-label" id="realNameLabel"><img src="${ctx}/images/redx.png">真实姓名：</label>
				<div class="controls">
					  <input name="name" id="name" value="" maxlength="50" placeholder="请填写真实姓名" type="text">
					  <span class="notic_info" id="realNameExample">
					  	例如:李强
					  </span>
				  </div>
			</div> 
			
			
			<div class="control-group">
			  <label class="control-label"><img src="${ctx}/images/redx.png">性别：</label>
			  <div class="controls">
				<select name="sex" id="sex">
				    <option value="男">男</option>
				    <option value="女">女</option>
				    <option value="保密">保密</option>
				</select>
			</div>
			</div>
			
			
			<div class="control-group" style="display: block;">
				<label class="control-label" id="realNameLabel"><img src="${ctx}/images/redx.png">年龄：</label>
				<div class="controls">
				  <input name="age" id="age" value="" maxlength="50" placeholder="请填写年龄" type="text">
				  <span class="notic_info" id="realNameExample">
				  	例如:23
				  </span>
				</div>
			</div> 
			
			<div class="control-group" style="display: block;">
			<label class="control-label" id="realNameLabel"><img src="${ctx}/images/redx.png">电话：</label>
			<div class="controls">
				  <input name="phone" id="phone" value="" maxlength="50" placeholder="请填写电话" type="text">
				  <span class="notic_info" id="realNameExample">
				  </span>
			 </div>
			</div> 
			
			<div class="control-group" style="display: block;">
				<label class="control-label" id="realNameLabel"><img src="${ctx}/images/redx.png">省份：</label>
				<div class="controls">
					  <input name="province" id="province" value="" maxlength="50" placeholder="请填写省份" type="text">
					  <span class="notic_info" id="realNameExample">
					  	例如:重庆
					  </span>
				 </div>
			</div> 
			
			<div class="control-group" style="display: block;">
			<label class="control-label" id="realNameLabel"><img src="${ctx}/images/redx.png">市：</label>
			<div class="controls">
			  <input name="city" id="city" value="" maxlength="50" placeholder="请填写市" type="text">
			  <span class="notic_info" id="realNameExample">
			  	例如:重庆市
			  </span>
			  </div>
			</div> 
			
			<div class="control-group" style="display: block;">
			<label class="control-label" id="realNameLabel"><img src="${ctx}/images/redx.png">区域：</label>
			<div class="controls">
			  <input name="area" id="area" value="" maxlength="50" placeholder="请填写区域" type="text">
			  <span class="notic_info" id="realNameExample">
			  	例如:南岸区
			  </span>
			  </div>
			</div> 
			
			<div class="control-group" style="display: block;">
				<label class="control-label" id="realNameLabel"><img src="${ctx}/images/redx.png">详细地址：</label>
				<div class="controls">
				  <input name="address" id="address" value="" maxlength="50" placeholder="请填写详细地址" type="text">
				  <span class="notic_info" id="realNameExample">
				  	例如:xxx路xxx号
				  </span>
	            </div>
          	</div> 
			<p style="color: red;margin-left: 180px;margin-top: 5px;margin-bottom: 5px;">${registerMsg }</p>
			<input style="margin-top:  15px;margin-left: 180px; width: 180px; display: block;" class="button button-glow button-rounded button-raised button-primary" value="同意以下协议并提交" type="submit"/>
			
			</div>
		  </div>
	  </form>
	</div>
</div>




<div style="width: 100%; background: rgb(239, 239, 239) none repeat scroll 0% 0%; padding: 0px; height: 85px; display: block; font-size: 11px; line-height: 15px; margin: 0px; font-family: Roboto-Regular,微软雅黑,宋体,Arial,sans-serif;"> 
      <div style="vertical-align: middle; background: transparent none repeat scroll 0% 0%; padding-top: 8px; text-align: center; color: rgb(102, 102, 102);">
        ©Copyright2017 <a href="#" target="_blank" style="color: rgb(102, 102, 102);">长江师范失物招领</a> All Rights Reserved
	  </div>
       
      <div style="vertical-align: middle; background: transparent none repeat scroll 0% 0%; margin: 10px auto; text-align: center;">
                 邮箱：<a href="#">895243872@qq.com</a>
	  </div>
       
	 	<div style="width: 300px; margin: 0px auto; padding: 0px; text-align: center;">
	 		<a target="_blank" href="#" style="display: inline-block; text-decoration: none; height: 20px; line-height: 20px;">
		 		<img src="${ctx }/images/gongAnBeiAnLogo.png" style="float: left;" data-bd-imgshare-binded="1">
		 		<p style="float: left; height: 20px; line-height: 20px; margin: 0px 0px 0px 5px; color: rgb(147, 147, 147);">
		 			渝公网安备 000000000000000号
		 		</p>
	 		</a>
	 	</div>
		 	   
</div>
<script type="text/javascript">

//上传图片
new AjaxUpload('#addLabProdPic', {
	action: '${ctx}/upload', 
	name: 'picFile',
	responseType: 'json',
	onSubmit : function(file , ext){
		if (ext && /^(jpg|png|bmp)$/.test(ext.toLowerCase())){
			this.setData({
				'picName': file
			});
		} else {
			alert("请上传格式为 jpg|png|bmp 的图片！");
			return false;				
		}
	},
	onComplete : function(file,response){
		if(response.error) {
			alert(response.error);
			return;
		}
		$('#head_img').attr('src',response.picUrl);
		$('#headImg').val(response.picUrl);
	}		
});

</script>



</body>
</html>


